/*body{margin: 0px;width: 1024px;height: 768px;}*/
*{-webkit-tap-highlight-color:rgba(255,255,255,0);outline: none;  -webkit-touch-callout: none;  -webkit-user-select: none;}
body{margin: 0px;}
.wrap{width: 1024px;height: 748px;}
#title{height:25px;width:1016px;padding:5px;line-height:25px;background:#212227;color:#FFFFFF;position: absolute;z-index:10}
#myCanvas{cursor:pointer;background-color: #fff;}
#menu{height:74px;width:1024px;background:#EFF7FE;border-top: 1px solid #555;}
.menu-left{height:30px;width:30px;float:left;}
.menu-right{height:80px;width:200px;float:right;}

#timeline{height:1px;width:516px;background-color:#D3DEE9;border-radius:1px;overflow:hideen;position: absolute;float: left;margin: 3.8% 0 0 22%;}
#total-time{position: absolute;right: 30px;bottom: 32px;}
#no_need{bottom: 32px;right: 110px;position: absolute;}
.time_now_left{bottom: 32px;right: 130px;position: absolute;}
#current-time{height:1px;width:0px;background-color:#5EB0D5;border-radius: 1px;}
#current-time i{width: 20px;height: 20px;background: #fff;border-radius: 20px;position: absolute;margin: -8px 0 0 0;}
#play{ height:74px;width:100px;float:left;/*margin:2.6% 0 0 6%;background-color:green;*/ cursor:pointer;background-position: center; }

.page_back{background: url(../images/play_back.png) no-repeat;width: 30px;height: 30px;float: left;margin: 2.5% 0 0 3.5%;}
.play{background: url(../images/play_start.png) no-repeat;}
.stop{background: url(../images/play_stop.png) no-repeat;}
/*
.voice-ctrl{height:25px;width:200px;float:left;margin:25px 5px;}
#mute{cursor:pointer; width:36px;float:left; }
#voice-bar{height:5px;width:100px;border:1px solid #000;background-color:#000;border-radius:5px;overflow:hideen;float:left; margin:8px 0px;}
#current-voice{height:5px;width:100px;background-color:red;border-radius:5px;overflow:hideen;float:left;}
*/
#time-view{ height:25px;width:250px;float:right;text-align:right;margin:2.4% 8% 0 0;font-size: 16px;font-family: "微软雅黑";}
#bg-selector{height:25px;width:150px;float:right;margin:5px;text-align:right;}
.bg-item{height:20px;width:20px;float:right;margin:2px 0 3px 5px;}
.white{background:white;}
.black{background:black;}
.blue{background:blue;}
#item_info{top:0;left: 0;height: 40px;background: #000;position: absolute;opacity:0.8;}
#item_info i{width:130px;height: 33px;background: url(../images/back.png) no-repeat;position: absolute;left: 20px; top: 6px;}
#video_info{position: absolute;color: #fff;top: 10px;left: 80px;}
 /* #wait_min{background: url(../images/1.png);position: absolute;}  */
@-webkit-keyframes rotate {
  from {-webkit-transform:rotate(0deg);}
  to {-webkit-transform:rotate(360deg);}
}
#wait_min {
  background: url(../images/1.png);
  position: absolute;
  -webkit-animation-name: rotate;
  -webkit-animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
}
@media screen and (min-width: 1000px) {
	#wait_min{left: 488px;top: 285px;width: 36px;height: 36px;}
  }
  
@media screen and (max-width: 999px) {
	#wait_min{width:36px;height: 36px;}
	#timeline{height: 5px;background-color: #444343;border-radius:5px;margin: 0px;left: 100px;top: 20px;}
	#current-time{height: 5px;background-color: red;border-radius:5px;}
	#menu{height: 45px;background: #000;opacity:0.8;position: absolute;margin-top: -45px;color: #fff;z-index: 10;}
	.stop{background-image:url(../images/pasu.png);}
	.play{background-image:url(../images/play.png);}
	#play{margin:1px 0 0 10px;width: 80px;height: 45px;float: left;Opacity:1;}
	#time_now_l{margin: 0;position: absolute;right: 100px;bottom: 13px;}
	#no_need{margin: 0;position: absolute;right: 90px;bottom: 13px;}
	#total-time{bottom: 13px;display: block;position: absolute;right: 25px;}
	#time-view{width: 200px;height: 22px;}
	
	
  }
  
